<template>
  <div v-if="user" style="width: 300px;text-align: left;height: 500px">
    <van-cell title="id" :value='user.id'/>
    <van-cell title="昵称" is-link :value='user.username' @click="toEdit('username','昵称',user.username)"/>
    <van-cell title="账号" :value='user.userAccount'/>
    <van-cell title="头像" is-link>
      <img :src="user.avatarUrl" width="60px" height="60px"/>
    </van-cell>
    <van-cell title="邮箱" is-link @click="toEdit('email','邮箱',user.email)" :value='user.email'/>
    <van-cell title="性别" is-link @click="toEdit('gender','性别',user.gender)" :value='user.gender'/>
    <van-cell title="身份" :value='user.userRole'/>
    <van-cell title="注册时间" :value='user.createTime'/>
  </div>
</template>
<script setup>
import {useRouter} from "vue-router";
import {onMounted, ref} from "vue";
import {getCurrentUser} from "../services/user.ts";

const router = useRouter();
name:'Index'
const user = ref()

const toEdit = (editKey, editName, currentVal) => {
  router.push({
    path: '/user/edit',
    query: {
      editKey,
      editName,
      currentVal,
    }
  })
}
onMounted(async () => {
  user.value = await getCurrentUser();

})
</script>
<style scoped>

</style>